<template>
  <div class="chat-tool">
    <emoji @selected="emojiSelected" />
    <record-audio @recordAudio="recordAudio"/>
    <upload-file type="file" @change="fileSelect" />
    <upload-file type="image" @change="imgSelect" />
    <!-- <upload-file type="video" @change="videoSelect" /> -->
    <el-tooltip content="分配任务" placement="top" :enterable="false">
      <i class="iconfont icon-task chat-tool-btn" @click="newTask"/>
    </el-tooltip>
    
  </div>
</template>

<script>
import Emoji from "./Emoji.vue";
import Recorder from "js-audio-recorder";
import RecordAudio from "@comp/base/RecordAudio.vue";
import UploadFile from '@comp/base/UploadFile.vue';
const recorder = new Recorder();

export default {
  components: {
    Emoji,
    RecordAudio,
    UploadFile,
  },
  model: {
    methods: [
      "emojiChange",
      "uploadImg",
      "uploadFile",
      "recordAudio",
      "uploadVideo",
      "newTask",
    ],
  },
  data() {
    return {
      
      recordIn: false,
    };
  },
  methods: {
    fileSelect(files) {
      console.log(files)
      this.$emit("uploadFile", files);
    },
    imgSelect(files) {
      this.$emit("uploadImg", files);
    },
    videoSelect(files) {
      this.$emit("uploadVideo", files);
    },
    recordAudio(duration, audio) {
      this.$emit("recordAudio", duration, audio);
    },
    emojiSelected(html) {
      this.$emit("emojiChange", html);
    },
    newTask(){
      this.$emit("newTask")
    }
  },
};
</script>

<style lang="less" scoped>
.chat-tool {
  height: 40px;
  line-height: 40px;
  background-color: #ececec;
  padding: 0px 10px;
}
.chat-tool-btn {
  cursor: pointer;
  margin-right: 10px;
}
</style>
